<template>
	<el-card class="box-card">
		<el-form :model="formData" ref="formData" :rules="rules">
			<el-form-item class="title" label-width="30px">
				<el-col :span="16">遛点兑换配置</el-col>
			</el-form-item>
			<el-form-item label="1遛点=" prop="value">
				<el-input v-model="formData.value" placeholder="输入" style="width:50%"></el-input>
				<span>¥</span>
			</el-form-item>
		</el-form>
		<el-button type="primary" style="width:100%;margin-top: 10px;" @click="submitForm('formData')">保存</el-button>
	</el-card>
</template>

<script>
	import { metaSave, metaList, metaUpdate } from "@/api/getData"
	export default {
		data() {
			var validateNewPoint = (rule, value, callback) => {
				if(value === '') {
					callback(new Error('请输入遛点配置'));
				} else {
					let reg =  /^\+?[1-9][0-9]*$/;
					if(!reg.test(value)) {
						callback(new Error('请输入整数'));
					}
					callback();
				}
			};
			return {
				formData: {
					value: "",
					id: ""
				},
				rules:{
					value: [{
						validator: validateNewPoint,
						trigger:  'blur'
					}],
				},
			}
		},

		created() {
			this.initData();
		},
		methods: {
			async initData() {
				const res = await metaList({
					type: "liudian",
					pageSize: "10",
					pageNum: "1",
					params: "1",
				});
				if(res.code == "0") {
					this.formData.id = res.list.rows[0].id;
					this.formData.value = res.list.rows[0].value;
				} else {
					this.$notify.error({
						title: '错误',
						message: res.msg,
						offset: 100
					});
				}
			},
			async submitForm(formName) {
				this.$refs[formName].validate(async(valid) => {
					if(valid) {
						let res = null;
						if(this.formData.id != "") {
							res = await metaUpdate({
								id: this.formData.id,
								type: "liudian",
								value: this.formData.value,
								description: "遛点兑换配置"
							});
						} else {
							res = await metaSave({
								type: "liudian",
								value: this.formData.value,
								description: "遛点兑换配置"
							});
						}

						if(res.code == "0") {
							this.$notify({
								title: '成功',
								message: '保存成功',
								type: 'success',
								offset: 100
							});
							this.initData();
						} else {
							this.$notify.error({
								title: '错误',
								message: res.msg,
								offset: 100
							});
						}
					}
				});
			},
		},
	}
</script>

<style scoped>
	.box-card {
		margin: 0 10px;
	}
	
	.title {
		background-color: #20a0ff;
		line-height: 60px;
		font-size: 18px;
		color: #fff;
	}
</style>